﻿<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>服务归档</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <!--引入本地的css样式-->
  <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../static/css/admin.css" media="all">
</head>
<body>

<div class="layui-fluid">
  <div class="layui-card">
    <!--搜索框-->
    <div class="layui-form layui-card-header layuiadmin-card-header-auto">
      <div class="layui-form-item">
        <div class="layui-input-inline">
          <label class="layui-form-label">服务名称</label>
          <div class="layui-input-block">
            <input type="text" style="width: 200px" name="service_name" id="service_name" required   placeholder="" autocomplete="off" class="layui-input">
          </div>
        </div>
        <div class="layui-input-inline" style="margin-left: 100px">
          <label class="layui-form-label">类型</label>
          <div style="width: 120px" class="layui-input-block">
            <select style="width: 120px" name="type_name" id="type_name" required  lay-verify="required"  autocomplete="off" class="layui-input">
              <option>不限</option>
              <option>投诉服务</option>
              <option>售前服务</option>
              <option>售后服务</option>
              <option>咨询服务</option>
            </select>
            <!--            <input type="text" name="type_name" id="type_name" required  lay-verify="required" placeholder="" autocomplete="off" class="layui-input">-->
          </div>
        </div>
        <div class="layui-input-inline" style="margin-left: 100px">
          <label class="layui-form-label">状态</label>
          <div style="width: 120px" class="layui-input-block">
            <select style="width: 120px" name="service_status" id="service_status" required  lay-verify="required"  autocomplete="off" class="layui-input">
              <option>不限</option>
              <option>已反馈</option>
              <option>已归档</option>

            </select>
            <!--            <input type="text" name="type_name" id="type_name" required  lay-verify="required" placeholder="" autocomplete="off" class="layui-input">-->
          </div>
        </div>

        <div class="layui-input-inline" style="margin-left: 900px;margin-top: -43px">
          <button class="layui-btn layuiadmin-btn-admin" id="btn_search" lay-submit lay-filter="LAY-user-back-search">
            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
          </button>
        </div>
      </div>

    </div>


    <div class="layui-card-body">
      <!--头部工具栏 id="toolbarDemo" lay-event="事件名"-->
      <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
          <!-- lay-event 给元素绑定事件名 -->
          <!--          <button class="layui-btn layuiadmin-btn-admin" lay-event="batchdel">-->
          <!--            批量删除-->
          <!--          </button>-->
          <!--          <button class="layui-btn layuiadmin-btn-admin" lay-event="add_house">-->
          <!--            处理-->
          <!--          </button>-->
        </div>
      </script>

      <!--数据表格-->
      <table class="layui-hide" id="LAY-user-back-manage" lay-filter="LAY-user-back-manage" ></table>

      <!--        <script type="text/html" id="employeeSexTpl">-->
      <!--          {{#  if(d.employee_sex == 1){ }}-->
      <!--          <span>男</span>-->
      <!--          {{#  } else if(d.employee_sex == 2){ }}-->
      <!--          <span>女</span>-->
      <!--          {{#  } }}-->
      <!--        </script>-->
      <!-- laytpl模板引擎 数据库状态字段
      1转换成正常显示到页面；2转换成冻结显示到页面 3转换成删除显示到页面 -->
      <!--        <script type="text/html" id="statusTpl">-->
      <!--          {{#  if(d.status == 1){ }}-->
      <!--          <span>正常</span>-->
      <!--          {{#  } else if(d.status == 2){ }}-->
      <!--          <button type="button" class="layui-btn-xs layui-btn-disabled">冻结</button>-->
      <!--          {{#  } else if(d.status == 3){ }}-->
      <!--          <button type="button" class="layui-btn-xs layui-btn-danger">删除</button>-->
      <!--          {{#  } }}-->
      <!--        </script>-->


      <!--        <script type="text/html" id="buttonTpl">-->
      <!--          {{#  if(d.check == true){ }}-->
      <!--            <button class="layui-btn layui-btn-xs">已审核</button>-->
      <!--          {{#  } else { }}-->
      <!--            <button class="layui-btn layui-btn-primary layui-btn-xs">未审核</button>-->
      <!--          {{#  } }}-->
      <!--        </script>-->

      <!--        <script type="text/html" id="table-useradmin-admin">-->
      <!--          <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>-->
      <!--          {{#  if(d.role == '超级管理员'){ }}-->
      <!--          <a class="layui-btn  layui-btn-xs"><i class="layui-icon layui-icon-delete"></i>删除</a>-->
      <!--          {{#  } else { }}-->
      <!--          <a class="layui-btn  layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>-->
      <!--          {{#  } }}-->
      <!--        </script>-->

      <!--侧边工具栏 id=barDemo lay-event="事件名"-->
      <script type="text/html" id="barDemo">
                {{#  if(d.service_status == 6){ }}
                <a class="layui-btn layui-btn-xs  layui-btn-disabled"  >查看</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs  layui-btn-disabled" >删除</a>
                {{#  }else{ }}
                <a class="layui-btn layui-btn-xs " lay-event="edit" >查看</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs " lay-event="del">删除</a>
                {{#  } }}
      </script>
      <script type="text/html" id="statusTpl">
        {{#  if(d.service_status == 4){ }}
        <span>已反馈</span>
        {{#  }else if(d.service_status == 6){ }}
        <span>已归档</span>
        {{#  } }}
      </script>
<!--      <script type="text/html" id="editTpl">-->
<!--        {{#  if(d.service_status == 6){ }}-->
<!--        <a class="layui-btn layui-btn-xs btn-view layui-btn-disabled" lay-event="edit" >查看</a>-->
<!--        <a class="layui-btn layui-btn-danger layui-btn-xs btn-delete layui-btn-disabled" lay-event="del">删除</a>-->
<!--        {{#  }else{ }}-->
<!--        <a class="layui-btn layui-btn-xs btn-view" lay-event="edit" >查看</a>-->
<!--        <a class="layui-btn layui-btn-danger layui-btn-xs btn-delete" lay-event="del">删除</a>-->
<!--        {{#  } }}-->
<!--      </script>-->
    </div>
  </div>
</div>

<script src="../../static/js/jquery-3.6.0.min.js"></script>
<!--引入本地layui.js-->
<script src="../../static/layui/layui.js"></script>
<!--js-->
<script type="text/javascript">
  layui.config({
    base: '../../static/layui/layuiadmin/' //静态资源所在路径js
  }).extend({
    index: 'lib/index' //主入口模块
  }).use('index');
</script>

<script type="text/javascript">
  layui.use(["form","layer"],function (){
    var table = layui.table;
    var form = layui.form;
    table.render({
      elem:"#LAY-user-back-manage",
      url:"/service/queryArchiving",
      title:"服务归档信息列表",
      toolbar:"#toolbarDemo",
      cols:[[

        {field:'id',title:'ID',fixed:'left',unresize:true,sort:true,width: 70},
        {field:'service_name',title:'服务名称',width: 200},
        {field:'service_type',title:'类型'},
        {field:'service_status',title:'状态',templet: '#statusTpl'},
        {field:'last_operation_time',title:'最后操作时间',width: 200},
        {field:'operator',title:'操作人'},
        {field:'pending_person',title:'待处理人'},
        {field:'aa', title:'操作',fixed:'right',toolbar:'#barDemo',width:150},

      ]],
      page:true,
      limits:[5,10,15,20]
    })//展示页面
    //查询功能，重载
    $("#btn_search").click(function (){
      var service_name = $("#service_name").val();
      var type_name = $("#type_name").val();
      var service_status = $("#service_status").val();
      table.reload('LAY-user-back-manage',{
        url: "/service/searchArchiving",
        page:{
          curr:1
        },
        where:{
          service_name:service_name,
          type_name:type_name,
          service_status:service_status
        }
      });
    })
    //删除
    table.on('tool(LAY-user-back-manage)',function (obj){
      console.log(obj)
      var data = obj.data;
      var event = obj.event;
      if (event=='del'){
        layer.confirm("确定要删吗",function (index){
          $.ajax({
            url:"/service/delProcessing",
            type: 'post',
            data: {id:data.id},
            dataType:'json',
            success:function (res){

              if (res.code==200){
                layer.alert(res.msg);
                obj.del();
                layer.close(index);
              }else{
                layer.alert(res.msg);
                layer.close(index);
              }
            }
          })
        })
      }
      else if(obj.event === 'edit'){//编辑功能
        layer.open({
          type:2,//iframe层
          title:'查看服务反馈信息',
          content:'ArchivingEdit.html',//展示编辑页面
          area:['450px','550px'],
          maxmin:true,
          btn:['归档','取消'],
          yes:function (index, layero){
            //应该把页面表单的数据提交给服务器
            //在当前页面获取iframe层子层的DOM-form表单


            var body = layer.getChildFrame('body', index);
            //获取edit.html页面中所有表单的数据
            var submitData = body.find("#myform").serialize();//serialize()只能序列化表单中文本
            //发起Ajax请求
            $.ajax({
              url:"/service/updateArchiving",
              type:"post",
              data:submitData,
              dataType: "json",
              success:function (res){

                if(res.code==200){
                  layer.msg(res.msg,{
                    offset:'15px',
                    icon:1,
                    time:1000
                  },function (){
                    //刷新
                    function traverseTableData() {

                    }

                    // 调用遍历函数
                    traverseTableData();
                    // $('tr[data-index=0]').find("a").attr("display","none");
                    console.log($('tr[data-index=0]').find("a")[0].type)
                    window.location.reload();
                  })
                }
                if(res.code==500){
                  layer.msg(res.msg,{
                    offset:'15px',
                    icon:1,
                    time:1000
                  },function (){
                    //刷新

                    window.location.reload();

                  })
                }
                layer.close(index);//关闭弹层
              }
            })
          },
          success: function(layero, index){//子页面edit.html页面数据回显
            var body = layer.getChildFrame('body', index);
            var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
            //input控件的输入框/隐藏框
            body.find("input[name=id]").val(data.id);

            body.find("input[name=service_name]").val(data.service_name);
            //select下拉框
            body.find("option[value="+data.service_type+"]").attr("selected",true)
            //input控件的输入框/隐藏框
            body.find("input[name=dopeople]").val(data.operator);
            body.find("input[name=waitpeople]").val(data.pending_person);
            body.find("input[name=customer_phone]").val(data.customer_phone);
            body.find("textarea[name=customer_content]").val(data.customer_content);
            body.find("textarea[name=note_information]").val(data.note_information);
            body.find("textarea[name=service_feedback]").val(data.service_feedback);

            //刷新渲染  重要！！！！
            iframeWin.layui.form.render();
          }
        })
      }
    })


  })
</script>

</body>
</html>

